<template>
	<view class="container">
		<uni-filter :filterData="filterData" :defaultSelected="filterDropdownValue" @sort="sortValue" @confirm="confirm"></uni-filter>
		<view style="margin-top: 130rpx;"></view>

		<view class="changfang">
			<view class="park-item" v-for="(item,index) in new_workshop" @click="change(item)">
				<view>
					<image class="park-item-image" :src="item.logo"></image>


				</view>
				<view class="quyu">{{item.quyu}} {{item.quyu1}}</view>

				<view class="dibu">

					<view class="dibu-left">
						<view class="dibu-left-title">
							{{item.name}}
						</view>
						<view class="tag-item">
							<view class="biaozhi" v-if="item.is_renzheng">
							<image class="image1" src="https://pic.fhshidai.com/file6wWaYqYP5Pl96vwYreOLw8qpHd1bzZUjI9xFB8ZJ.png"></image>
							</view>
							<view class="tag" v-for="(tag,index) in item.tags">{{tag.name}}</view>
						</view>
					</view>
					<view class="dibu-right">

						<view v-if="item.price" class="dibu-right-price">均价:{{item.price}}元/㎡</view>
						<view v-if="!item.price" class="dibu-right-price">面议</view>
						<view class="park-item-time" v-if="item.kaipan_time">{{item.kaipan_time}} 开盘</view>
						<view class="park-item-time" v-else>  </view>
					</view>
				</view>

			</view>
		</view>
		<uni-load-more :status="more" color="#000000" @clickLoadMore="getFactorys"></uni-load-more>
		<uni-footer></uni-footer>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				more: "more",
				page: 1,
				new_workshop: [],
				loadingText: "正在加载...",
				filterDropdownValue: [],
				filterData: [],
				form: {},
				indexArr: '',
				valueArr: '',
				parks: '',
				tejia: '',
				ershou: '',
				search_key: '',
				address_id: '',
				sort: false,
			};
		},
		onShareAppMessage() {},
		filters: {
			outData(value) {
				console.log('outdata', value)
				return JSON.stringify(value);
			}
		},
		onPullDownRefresh() {
			//监听下拉刷新动作的执行方法，每次手动下拉刷新都会执行一次
			this.page = 1
			this.new_workshop = []
			this.more = 'more'

			this.getFactorys()
		},

		methods: {
			confirm({
				index,
				value
			}) {
				this.indexArr = index;
				this.valueArr = value;
				this.page = 1
				this.new_workshop = []
				this.more = 'more'
				let form = {}
				for (let i in index) {
					for (let y in index[i]) {
						console.log(this.filterData[i].submenu[y])
						form[this.filterData[i].submenu[y].slug] = ''
						for (let x in index[i][y]) {
							console.log(131)
							console.log(this.filterData[i].submenu[y].submenu[x])
							form[this.filterData[i].submenu[y].slug] = this.valueArr[i][y][x]
						}
					}
				}
				this.form = form
				console.log(this.parks)
				this.form['parks'] = this.parks
				this.form['tejia'] = this.tejia
				this.form['ershou'] = this.ershou
				this.form['search_key'] = this.search_key
				this.form['sort'] = this.sort
				console.log(this.form['parks'])
				this.getFactorys()
			},
			sortValue(sort) {
				this.sort = sort
				this.page = 1
				this.new_workshop = []
				this.more = 'more'


				this.getFactorys()
			},
			getFactorys() {
				if (this.more == 'noMore') {
					return
				}

				this.form = Object.assign(this.form, {
					page: this.page,
					sort: this.sort,
					address_id: this.address_id
				})
				console.log(this.form)
				console.log(this.form)
				this.more = "loading"
				this.$api.parks(this.form).then(res => {
					this.new_workshop = this.new_workshop.concat(res.data);
					console.log(this.new_workshop)
					uni.stopPullDownRefresh();
					this.page = this.page + 1
					if (!res.links.next) {
						this.more = 'noMore'
					} else {
						this.more = "more"
					}

				})
			},
			change(item) {
				uni.navigateTo({
					url: '/pages/area/detail/detail?id=' + item.id
				})
			}
		},

		onLoad: function() {
			console.log('onload')

			if (uni.getStorageSync('address_id')) {
				this.$api.getFactorysCondition1().then(res => {
					console.log(res.data)
					this.filterData = res.data;
				})
				this.address_id = uni.getStorageSync('address_id')

				this.getFactorys()
			} else {
				this.$api.getDefaultRegions().then(
					res => {
						console.log(res)
						uni.setStorageSync('address', res.data.name)
						uni.setStorageSync('address_id', res.data.id)
						this.address_id = uni.setStorageSync('address_id', res.data.id)
						this.getFactorys()
					}

				)
			}



		}


	}
</script>
<style>
	page {
		background-color: #f3f3f3;
	}
</style>
<style scoped lang="scss">
	.container {
		background-color: #f3f3f3;
	}

	.changfang {
		padding-left: 30rpx;
		padding-right: 30rpx;
	}

	.biaozhi {
		display: inline-flex;
		justify-content: center;
		align-items: center;
		width: 100rpx;
		height: 35rpx;
		background: rgba(218, 51, 55, 1);
		border-radius: 4rpx;
		text-align: center;
		margin-right: 10rpx;

		.image1 {
			border-radius: 0rpx;
			width: 87rpx;
			height: 18rpx;
		}
	}
	.park-item {
		position: relative;
		width: 690rpx;
		margin-top: 37rpx;
		background: rgba(255, 255, 255, 1);
		border-radius: 10rpx;
		padding-bottom: 20rpx;
	}

	.park-item-image {
		width: 689rpx;
		height: 285rpx;
		background: rgba(0, 0, 0, 1);

	}

	.park-item-time {

		margin-top: 19rpx;
		height: 23rpx;
		font-size: 24rpx;
		font-family: SourceHanSansCN;
		font-weight: 400;
		color: #181818;
	}

	.tag-item {

		padding-top: 19rpx;
		display: flex;

		.tag {
			width: 120rpx;
			height: 34rpx;
			display: flex;
			align-items: center;
			justify-content: center;

			background: #ECF1F4;
			border-radius: 4rpx;
			margin-right: 8rpx;
			font-size: 20rpx;
			font-family: SourceHanSansCN;
			font-weight: 400;
			color: rgba(71, 105, 135, 1);
		}
	}

	.quyu {
		padding-left: 23rpx;
		margin-top: 22rpx;
		font-size: 20rpx;
		font-family: SourceHanSansCN;
		font-weight: 400;
		color: rgba(154, 155, 160, 1);
	}

	.dibu {
		display: flex;
		width: 100%;
		padding-left: 23rpx;
		padding-right: 32rpx;
		justify-content: space-between;
		align-items: center;
		padding-top: 11rpx;

		.dibu-left {


			.dibu-left-title {
				font-size: 30rpx;
				font-family: SourceHanSansCN;
				font-weight: bold;
				color: rgba(0, 0, 0, 1);

			}
		}

		.dibu-right {

			display: flex;
			flex-direction: column;
			align-items: flex-end;

			.dibu-right-price {
				color: rgba(218, 51, 55, 1);
				font-weight: bold;
				font-size: 30rpx;
				font-family: SourceHanSansCN;

			}
		}
	}
</style>
